<template>
  <div>
    <el-table
      v-loading="loading"
      :data="list"
      element-loading-text="数据加载中..."
      border
      fit
      highlight-current-row
      :header-cell-style="{color:'#000000'}"
    >
      <el-table-column key="0" align="center" width="60">
        <template slot-scope="{row}">
          <el-checkbox v-model="row.checked" @change="getSelectValue($event, row.id)" />
        </template>
      </el-table-column>
      <el-table-column key="1" align="center" label="姓名" prop="name" />
      <el-table-column key="2" align="center" label="工号" prop="employee_no" />
      <el-table-column key="3" align="center" label="电话" prop="mobile" />
      <!-- <el-table-column label="项目" width="150">
        <template slot-scope="{row}">
          <el-checkbox v-model="row.checked" @change="getSelectValue($event, row.id)">{{ row.name }}</el-checkbox>
        </template>
      </el-table-column>
      <el-table-column label="教学秘书">
        <template slot-scope="{row}">
          <span v-for="principal in row.principals" :key="principal.id">
            <el-tag type="info">{{ principal.name }}</el-tag>
          </span>
        </template>
      </el-table-column> -->
    </el-table>
  </div>
</template>

<script>
import { $tooltips } from '@/sun-components/SunMsg.js'
import { $butRequest } from '@/sun-components/SunProcessButRequests.js'
export default {
  name: 'ProcessCommonAuditInformationSelectPerson',
  props: {
    source: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      list: [],
      loading: true,
      btnList: []
    }
  },
  computed: {
    show_selectPerson() {
      return this.$parent.$parent.show_selectPerson
    }
  },
  watch: {
    show_selectPerson: {
      handler: function(show) {
        if (show) {
          this.requestData()
        }
      }
    }
  },
  created() {
    if (this.show_selectPerson) {
      this.requestData()
    }
  },
  methods: {
    async requestData() {
      const _that = this
      const btn = this.$parent.$parent.set_advance_request
      if (btn.model === 'allot_department') { // 确保接口的准确性
        $butRequest(btn)
          .then((response) => {
            _that.loading = false
            _that.list = response
          }).catch(() => {})
      } else {
        $tooltips('请求终止,流程错误!')
      }
    },
    async getSelectValue(checked, rowid) {
      const _that = this
      _that.list.forEach((item) => {
        if (rowid === item.id) {
          console.log('item.id', item.id)
          item.checked = checked
          if (checked) {
            _that.$parent.$parent.checkedItem = item
          } else {
            _that.$parent.$parent.checkedItem = null
          }
        } else {
          item.checked = false
        }
      })
    }
  }
}
</script>
